<template>
  <view class="broadcast-contanier">
    <view class="today-sell cmbox">
      <view class="head-txt">
        <view class="box-txt"> 今日必抢</view>
        <view class="text"> 手慢无</view>
      </view>
      <concertList
          :concertList="startSaleOfDayConcertList"
          :hasMore="false"
          :loading="false"
          :is-today="true"
      ></concertList>
    </view>
    <view class="will-sell cmbox">
      <view class="head-txt">
        <view class="box-txt"> 即将开抢</view>
        <view class="text"> 不要错过噢~</view>
      </view>
      <concertList
          @refresh="init"
          :concertList="willSaleOfNearDayConcertList"
          :hasMore="false"
          :loading="false"
          :will-start-sale="true"
      ></concertList>
    </view>
  </view>
</template>

<script>
import {getStartSaleOfNearDayPerformance, getStartSaleOfTodayPerformance} from "../../api/user/concert";
import concertList from "../../uni_modules/uni-badge/components/concert-list/concert-list.vue";

export default {
  computed: {
    concertList() {
      return concertList
    }
  },
  components: {concertList},
  data() {
    return {
      startSaleOfDayConcertList: [],
      willSaleOfNearDayConcertList: [],
    };
  },
  created() {
    this.init();
  },
  methods: {
    init() {
      getStartSaleOfTodayPerformance().then(res => {
        this.startSaleOfDayConcertList = res.data;
      })
      getStartSaleOfNearDayPerformance().then(res => {
        this.willSaleOfNearDayConcertList = res.data;
      })
    },
  },
};
</script>

<style lang="scss">
.broadcast-contanier {
  width: 100%;
  height: 100%;
  background-color: white;
}

.cmbox {
  padding: 10px;
  width: 100%;
  box-sizing: border-box;

  .head-txt {
    display: flex;
    align-items: center;
    justify-content: start;
    width: 100%;
    height: 50px;
    letter-spacing: 2rpx;

    .box-txt {
      font-weight: bold;
      font-size: 36px;
    }

    .text {
      margin-top: 20px;
      margin-left: 5px;
      color: #3d3c3c;
      font-size: 18px;
    }
  }
}


</style>
